<template>
	<view class="page-box">
		<view class="flex-vertical top-box">
			<image class="order-result-logo" src="/static/icon-result-suggest.png" />
			<view class="order-result">{{title}}</view>
		</view>

		<view class="ok-btn" @tap="toBtn" v-if="btnText">{{btnText}}</view>
	</view>
</template>
<script>
	export default {
		components: {},
		data() {
			return {
				title: '预约成功',
				btnText: '',
				btnUrl: ''
			};
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad(options) {
			console.log(options);
		},
		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh() {},
		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom() {},
		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage() {},
		methods: {
			toBtn() {
				uni.navigateTo({
					url: this.btnUrl
				});
			},
		}
	};
</script>
<style lang="scss">
	.top-box {
		padding: 64rpx 32rpx 70rpx;
		box-sizing: border-box;
		flex-direction: column;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #9da0a3;
		text-align: center;

		.order-result-logo {
			width: 128rpx;
			height: 128rpx;
		}

		.order-result {
			font-size: 36rpx;
			color: #060607;
			margin: 48rpx 0 22rpx;
		}
	}

	.ok-btn {
		width: calc(100% - 100rpx);
		height: 90rpx;
		border: 1px solid #2775FF;
		border-radius: 8rpx;
		line-height: 90rpx;
		font-size: 34rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #2775FF;
		text-align: center;
		margin: 20rpx 50rpx 20rpx;
	}
</style>